<template>
	<view class="page">
		<view class="my_title_set ">
			<view class="chat vCenter" @click="handleChat">
				<uni-icons class="my_address_icon" type="chat" size="25" color="#ffffff"></uni-icons>
				<view class="status"></view>
			</view>
			<view class="setBtn vCenter" @click="handleSet">
				<uni-icons class="my_address_icon" type="gear" size="25" color="#ffffff"></uni-icons>
			</view>
		</view>
		<view class="my_title_box">
			<view class="my_title_left">
				<image class="my_pic" src="@/static/img/default.png" mode="scaleToFill"></image>
			</view>
			<view class="my_title_right">
				<view class="my_title">
					尼古拉斯凯瑞跟
				</view>
				<view class="my_phone">
					183****2074
				</view>
			</view>
		</view>
		<view class="enter">
			<view class="item" @click="handleBusines">
				<image src="../../static/img/buss.png"></image>
				<text>商家入口</text>
			</view>
			<view class="item" @click="handleTeacher">
				<image src="../../static/img/tech.png"></image>
				<text>师傅入口</text>
			</view>
			<view class="item">
				<image src="../../static/img/emp.png"></image>
				<text>我要推广</text>
			</view>
		</view>
		<view class="line25"></view>
		<view class="acount" @click="handleMyaccount">
			<view class="item">
				<view class="title">账户余额(元)</view>
				<view class="liveMoney">23456.32</view>
			</view>
			<view class="item">
				<view class="title">冻结金额(元)</view>
				<view class="dieMoney">23456.32</view>
			</view>
		</view>
		<view class="line25"></view>
		<view class="my_list">
			<navigator class="my_Order_box" url="/pages/my/my_order/my_order" hover-class="none">
				<view class="my_Order my_item">
					<image src="../../static/img/my1.png"></image><text>我的订单</text>
				</view>
				<uni-icons class="my_Order_icon" type="forward" size="20" color="#B3B3B3"></uni-icons>
			</navigator>
			<navigator class="my_address_box" url="/pages/my/my_address/my_address" hover-class="none">
				<view class="my_address my_item">
					<image src="../../static/img/my2.png"></image><text>地址管理</text>
				</view>
				<uni-icons class="my_address_icon" type="forward" size="20" color="#B3B3B3"></uni-icons>
			</navigator>
			<navigator url="/pages/my/personal_certification/personal_certification" class="my_Authentication_box" hover-class="none">
				<view class="my_Authentication my_item">
					<image src="../../static/img/my3.png"></image><text>实名认证</text>
				</view>
				<uni-icons class="my_Authentication_icon" type="forward" size="20" color="#B3B3B3"></uni-icons>
			</navigator>
			<navigator url="/pages/my/my_order/pulish_order" class="my_demand_box" hover-class="none">
				<view class="my_demand my_item">
					<image src="../../static/img/my4.png"></image><text>发布需求</text>
				</view>
				<uni-icons class="my_demand_icon" type="forward" size="20" color="#B3B3B3"></uni-icons>
			</navigator>
			<navigator url="/pages/my/my_service/push_service" class="my_Authentication_box" hover-class="none">
				<view class="my_Authentication my_item">
					<image src="../../static/img/my5.png"></image><text>发布服务</text>
				</view>
				<uni-icons class="my_Authentication_icon" type="forward" size="20" color="#B3B3B3"></uni-icons>
			</navigator>
			<navigator url="/pages/my/my_comments/my_comments" class="my_evaluate_box" hover-class="nonez">
				<view class="my_evaluate my_item">
					<image src="../../static/img/my6.png"></image><text>我的评价</text>
				</view>
				<uni-icons class="my_evaluate_icon" type="forward" size="20" color="#B3B3B3"></uni-icons>
			</navigator>
			<view class="my_customerService_box">
				<view class="my_customerService my_item">
					<image src="../../static/img/my7.png"></image><text>联系客服</text>
				</view>
				<view class="callPhone">400-11—1234</view>
				<uni-icons class="my_customerService_icon" type="forward" size="20" color="#B3B3B3"></uni-icons>
			</view>
			<!-- <navigator url="/pages/my/my_proposal/my_proposal" class="my_proposal_box" hover-class="none">
				<view class="my_proposal my_item">
					<image src="../../static/img/my8.png"></image><text>关于我们</text>
				</view>
				<uni-icons class="my_proposal_icon" type="forward" size="20" color="#B3B3B3"></uni-icons>
			</navigator> -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				avatar: '',
				name: '',
				phone: '',
				isLogin: uni.getStorageSync('myInfo')
			};
		},
		onLoad() {
			if (!this.isLogin) {
				uni.navigateTo({
					url: "/pages/authorize/authorize"
				})
			} else  {
				
			}
		},
		methods: {
			handleSet () {
				uni.navigateTo({
					url: "/pages/my/my_set/my_set"
				})
			},
			handleBusines () {
				uni.navigateTo({
					url:"../live/my_business_order"
				})
			},
			handleTeacher () {
				// uni.navigateTo({
				// 	url: "../live/teacher_live"
				// })
				uni.navigateTo({
					url: "../live/my_teacher_order"
				})
			},
			handleMyaccount () {
				uni.navigateTo({
					url: "/pages/my/my_account/my_account"
				})
			},
			handleChat () {
				uni.navigateTo({
					url: "/pages/my/my_chat/my_chat"
				})
			}
		}
	}
</script>
<style>
	page {
		background: #fff;
	}
</style>
<style lang="scss">
	.my_title_set {
		width: 100%;
		// height: 117rpx;
		padding: 20rpx 0;
		height: auto;
		overflow: hidden;
		background: #368AFF;

		.setBtn,.chat {
			position: relative;
			float: right;
			// height: 100%;
			margin-right: 33rpx;
		}
		.chat {
			.status {
				position: absolute;
				top: 0;
				right: 0;
				width: 8rpx;
				height: 8rpx;
				border-radius: 4rpx;
				background: #FE6A6A;
			}
		}
	}

	.enter {
		display: flex;
		padding-top: 19rpx;
		padding-bottom: 33rpx;

		.item {
			flex: 1;
			text-align: center;

			image {
				width: 100rpx;
				height: 100rpx;
			}

			text {
				display: block;
				font-size: 32rpx;
				color: #565656;
			}
		}
	}

	.acount {
		display: flex;
		padding-top: 35rpx;
		padding-bottom: 33rpx;

		.item {
			flex: 1;
			text-align: center;

			.title {
				line-height: 100%;
				margin-bottom: 10rpx;
				font-size: 28rpx;
				color: #B3B3B3;
			}

			.liveMoney {
				font-size: 50rpx;
				color: #565656;
			}

			.dieMoney {
				font-size: 50rpx;
				color: #FE6A6A;
			}
		}
	}

	.my_title_box {
		background-color: #fff;
		width: 100%;
		height: 183rpx;
		display: flex;
		padding: 0 33rpx;
		box-sizing: border-box;
		background: #368AFF;

		.my_title_left {
			flex: 0 0 133rpx;
			width: 133rpx;

			.my_pic {
				width: 133rpx;
				height: 133rpx;
				border-radius: 50%;
			}
		}

		.my_title_right {
			margin-left: 33rpx;
			padding-top: 26rpx;

			.my_title {
				margin: 0rpx 0 17rpx 0;
				line-height: 100%;
				font-size: 38rpx;
				color: #fff;
			}

			.my_phone {
				line-height: 100%;
				font-size: 26rpx;
				color: #fff;
			}
		}
	}

	.my_list {
		box-sizing: border-box;
		margin-top: 12rpx;
		padding: 5rpx 28rpx 5rpx 28rpx;
		navigator {
			border-bottom: 1px solid rgba($color: #eee, $alpha: .5);
		}
		.my_customerService_box {
			border-bottom: 1px solid rgba($color: #eee, $alpha: .5);
		}
		.my_item {
			image {
				width: 50rpx;
				height: 50rpx;
				margin-right: 17rpx;
				vertical-align: middle;
			}

			text {
				color: #565656;
				font-size: 32rpx;
				vertical-align: middle;
			}
		}

		.my_address_box {
			display: flex;
			padding: 25rpx 0 25rpx 0;
			justify-content: space-between;

			.my_address {
				height: 50rpx;
			}

			.my_address_icon {}
		}

		.my_Order_box {
			display: flex;
			padding: 25rpx 0 25rpx 0;
			justify-content: space-between;

			.my_Order {
				height: 50rpx;
			}

			.my_Order_icon {}
		}

		.my_evaluate_box {
			display: flex;
			padding: 25rpx 0 25rpx 0;
			justify-content: space-between;

			.my_evaluate {
				height: 50rpx;

			}

			.my_evaluate_icon {}
		}

		.my_Authentication_box {
			display: flex;
			padding: 25rpx 0 25rpx 0;
			justify-content: space-between;

			.my_Authentication {
				height: 50rpx;

			}

			.my_Authentication_icon {}
		}

		.my_demand_box {
			display: flex;
			padding: 25rpx 0 25rpx 0;
			justify-content: space-between;

			.my_demand {
				height: 50rpx;

			}

			.my_demand_icon {}
		}

		.my_proposal_box {
			display: flex;
			padding: 25rpx 0 25rpx 0;
			justify-content: space-between;

			.my_proposal {
				height: 50rpx;

			}

			.my_proposal_icon {}
		}

		.my_customerService_box {
			display: flex;
			padding: 25rpx 0 25rpx 0;
			justify-content: space-between;
			position: relative;

			.my_customerService {
				height: 50rpx;
				line-height: 50rpx;
				color: #565656;
				font-size: 32rpx;
			}

			.callPhone {
				position: absolute;
				top: 50%;
				right: 75rpx;
				transform: translateY(-50%);
				height: 50rpx;
				line-height: 50rpx;
				font-size: 32rpx;
				color: #565656;
			}

			.my_customerService_phone {
				// margin-left: 374rpx;
				font-size: 24rpx;

				.phone_top {
					margin-left: 356rpx;
				}

				.phone_button {
					margin-left: 267rpx;
				}
			}

			.my_customerService_icon {
				line-height: 50rpx;
			}
		}
	}

	.line25 {
		width: 100%;
		height: 25rpx;
		background: #F4F4F4;
	}
</style>
